<template>
  <el-dialog
    title="提示"
    :visible="true"
    width="30%"
  >
    <el-form>
      <el-form-item label="状态变更为：">
        <el-select v-model="status" placeholder="请选择">
          <el-option
            v-for="item in options"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="$emit('close')">取 消</el-button>
      <el-button type="primary" @click="onSubmit">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  import { saveOrUpdateSection } from '@/services/section'
  import { saveOrUpdateLesson } from '@/services/lesson'

  export default {
    name: 'UpdateSectionAndLessonStatus',
    props: {
      sectionId: {
        type: [Number, String],
      },
      lessonId: {
        type: [Number, String],
      },
      value: {
        type: Number,
        required: true,
      },
    },
    data() {
      return {
        options: [{
          value: 0,
          label: '已隐藏',
        }, {
          value: 1,
          label: '待更新',
        }, {
          value: 2,
          label: '已更新',
        }],
        status: undefined,
      }
    },
    created() {
      this.status = this.value
    },
    methods: {
      async onSubmit() {
        if (this.sectionId) {
          const { code } = await saveOrUpdateSection({
            id: this.sectionId,
            status: this.status,
          })
          if (code === '000000') {
            this.$emit('success', this.status)
            this.$message.success('更新成功')
          }
        } else {
          const { code } = await saveOrUpdateLesson({
            id: this.lessonId,
            status: this.status,
          })
          if (code === '000000') {
            this.$emit('success', this.status)
            this.$message.success('更新成功')
          }
        }
      }
    }
  }
</script>
